<template>
    <div class="shop_page">
        <back title="网点"></back>
        <div class="shop_content">
            <div class="shop_item" v-for="(item,index) in shoplist" :key="index">
                <div class="name"><span></span>{{item.shop_name}}</div>
                <div class="desc"><span>介绍：</span>{{item.shop_desc || '暂无简介'}}</div>
                <!-- <div class="status"><span>状态:</span>{{item.status}}</div> -->
                <div class="shop_image_1" :style="{'background-image':`url(${item.shop_image_1})`}"></div>
            </div>
            <more v-if="list.length > 19" @click.native="morefn"></more>
        </div>
    </div>
</template>

<style lang="stylus">
.shop_page{
    padding-top 55px
    background #f1f1f1
    .shop_content{
        height 100%
        overflow-y auto 
        padding 0 10px
        .shop_item{
            background #fff
            padding 10px
            border-radius 5px
            .name{
                font-size 16px
                margin-bottom 10px
            }
            .desc{
                font-size 12px
                color #555
                margin-bottom 10px
            }
            .status{
                font-size 12px
                color #1683d8
                margin-bottom 10px
            }
            .shop_image_1{
                width 100%
                height 200px
                overflow hidden 
                background-repeat no-repeat
                background-size cover
                background-position center
                border-radius 5px
            }
        }
    }
}
</style>

<script>
export default {
    data(){
        return{
            shoplist:[],
            list:[],
            page:1
        }
    },
    created(){
        this.getList()
    },
    methods:{
        getList(){
            this.$http.get(`/Shop/getList`,{
                page:this.page
            }).then( res => {
                console.log(res)
                if(res.code == 200){
                    this.list = res.data.shops
                    this.shoplist = this.shoplist.concat(this.list)
                }
                this.page ++
            })
        }
    }
}
</script>
